<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" session="true"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<style type="text/css">
    #layerPop{  
        width:500px;
        height:200px;         
        position:absolute;  
        background:#ffffff;      
        display: none;  
        border: 5px solid #3571B5;
        padding:10px;     
    }  

    #layerPop .close{    
        position:absolute;
        bottom:5px;
        right:5px;
    }

    .bg {
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        background:#000;
        opacity:.5;
        filter:alpha(opacity=50);
        display:none;
    }

</style>  

<script type="text/javascript">

function openLayerPopup(event, diaryGrpNo){   
   $("#grpMoveBtn").attr("href", "javascript:diaryListAjax('" +diaryGrpNo + "');");     
   $("#grpUpdateBtn").attr("href", "javascript:diaryGrpUpdateForm('" +diaryGrpNo + "');");
   $("#grpDeleteBtn").attr("href", "javascript:diaryGrpDeleteAjax('" +diaryGrpNo + "');");     
   var layerPop = $("#layerPop");     
   var bg = $(".bg");
   bg.fadeIn();     
   layerPop.fadeIn();
   var top = (event.pageY - 30) + "px";                                  
   var left = (event.pageX - 250) + "px";               
   layerPop.css("top", top);
   layerPop.css("left", left);
}

//레이어 팝업 닫기
function closeLayer(){
	$("#layerPop").hide();
}

//load scriptting
$(document).ready(function () {
	// 오늘날짜세팅
	today();  
	
	// 플랜 리스트
	diaryGrpListAjax();  
	
    $("#diaryNm").bind("keydown", function(e) {
        if (e.keyCode == 13) { // enter key
        	if($("#diaryGrpNo").val() == ""){
        		diaryGrpRegistAjax();  
        	}else{
        		diaryRegistAjax();   
        	}
        	  
            return false;   
        } 

    });
	
	$(".datepicker2").datepicker({
		 dateFormat: 'yy-mm-dd',   
	     monthNamesShort: ['1','2','3','4','5','6','7','8','9','10','11','12'],
	     dayNamesMin: ['일','월','화','수','목','금','토'],
	     weekHeader: 'Wk',
	     changeMonth: true, //월변경가능
	     changeYear: true, //년변경가능
	     showMonthAfterYear: true, //년 뒤에 월 표시
	     buttonImageOnly: false, //이미지표시  
	     autoSize: false,
	     onSelect: function(dateText, inst) {
	    	 var date = $(this).val();  
	    	 $("#diaryDate").val(date);      
	    	 diaryGrpListAjax();  
	     }   
	});
	   	
});    

function diaryDeleteAjax(diaryNo){  
	$.ajax({  
		type:"post"   
		,url:"/admin/diary/diaryDeleteAjax.do"
		,data:{"diaryNo":diaryNo}
		,dataType:"json"
		,success:function(data){
			if(data == 1){  
				diaryListAjax($("#diaryGrpNo").val());  
			}
		}
	});
}   
   
function diaryListAjax(diaryGrpNo) {
	$("#layerPop").hide();
	$("#diaryGrpNo").val(diaryGrpNo);
	$("#registBtn").attr("href", "javascript:diaryRegistAjax();");
	$.ajax({   
		type:"post"
		,url:"/admin/diary/diaryListAjax.do"
		,data:{"diaryGrpNo":diaryGrpNo,"diaryDate":$("#diaryDate").val()} 
		,dataType:"json"     
		,success:function(data){      
			var diaryMainDiv = "";  
			if(data.length > 0){  
				for(var i=0; i<data.length;i++){      
					diaryMainDiv += " <a href=\"#\" ondblclick=\"diaryDeleteAjax('" + data[i].diaryNo + "'); \" class=\"list-group-item\" >" + (i + 1) + ". " + data[i].diaryNm + "</a>";  
				}         
			}       
			$("#diaryMainDiv").html(diaryMainDiv);
		}
	});
}

function diaryRegistAjax() {
	if($("#diaryNm").val() == "" || $("#diaryNm").val() == null){
		alert("입력해주세요.");
		return;
	}
	$.ajax({
		type:"post"
		,url:"/admin/diary/diaryRegistAjax.do"
		,data:{"diaryNm":$("#diaryNm").val()
			  ,"diaryGrpNo":$("#diaryGrpNo").val()  
		}  
		,dataType:"json"
		,success:function(data){   
			if(data == 1){  
				$("#diaryNm").val("");    
				diaryListAjax($("#diaryGrpNo").val());
			}  
		} 
	});
}      

function diaryGrpListAjax() { 
	$("#diaryGrpNo").val(""); 
	$("#registBtn").attr("href", "javascript:diaryGrpRegistAjax();");
	$.ajax({   
		type:"post"
		,url:"/admin/diary/diaryGrpListAjax.do"
		,data:{"diaryDate":$("#diaryDate").val()}     
		,dataType:"json"     
		,success:function(data){
			var diaryGrpMainDiv = "";     
			if(data.length > 0){    
				for(var i=0; i<data.length;i++){           
					diaryGrpMainDiv += " <a href=\"#\" onclick=\"openLayerPopup(event, '" + data[i].diaryGrpNo + "'); \" class=\"list-group-item\" ><span class=\"badge pull-right\">" + data[i].diaryCnt + "</span>" + (i + 1) + ". " + data[i].diaryNm + "</a>";  
				}                 
			}    
			$("#diaryMainDiv").html(diaryGrpMainDiv);
		}     
	});  
}  

function diaryGrpRegistAjax() {
	if($("#diaryNm").val() == "" || $("#diaryNm").val() == null){
		alert("입력해주세요.");
		return;
	}
	
	$.ajax({
		type:"post" 
		,url:"/admin/diary/diaryGrpRegistAjax.do"
		,data:{"diaryNm":$("#diaryNm").val()}  
		,dataType:"json"  
		,success:function(data){   
			if(data == 1){  
				$("#diaryNm").val("");
				diaryGrpListAjax();
			}
		} 
	});
}     

function diaryGrpDeleteAjax(diaryGrpNo){
    $("#layerPop").hide();       
	$.ajax({ 
		type:"post"     
		,url:"/admin/diary/diaryGrpDeleteAjax.do"  
		,data:{"diaryGrpNo":diaryGrpNo}
		,dataType:"json"
		,success:function(data){
			if(data == 1){  
				diaryGrpListAjax();   
			}
		}
	});
} 
 
function diaryGrpUpdateForm(diaryGrpNo) {  
    $("#grpUpdateProcBtn").attr("href", "javascript:diaryGrpUpdateAjax('" +diaryGrpNo + "');");
    $("#diaryGrpUpdateForm").show();      
}     

function diaryGrpUpdateAjax(diaryGrpNo){
if($("#diaryUpdateNm").val() == "" || $("#diaryUpdateNm").val() == null){
	alert("입력해주세요.");
	return;
}
	$.ajax({    
		type:"post"   
		,url:"/admin/diary/diaryGrpUpdateAjax.do"  
		,data:{"diaryGrpNo":diaryGrpNo, "diaryNm":$("#diaryUpdateNm").val()}
		,dataType:"json"    
		,success:function(data){
			if(data == 1){  
				$("#layerPop").hide();
			    $("#diaryGrpUpdateForm").hide();
				diaryGrpListAjax();  
				
			}
		}
	});
} 


//날짜 계산 함수
function today(){
	var today = new Date();   
	$("#diaryDate").val(formatDate(today));
}    

function formatDate(d)
{
    var month = d.getMonth();
    var day = d.getDate();
    month = month + 1;

    month = month + "";

    if (month.length == 1)
    {
        month = "0" + month;
    }

    day = day + "";

    if (day.length == 1)
    {
        day = "0" + day;
    }

    return d.getFullYear() + '-' + month + '-' + day;  
}
 
</script>
<input type="hidden" name="diaryGrpNo" id="diaryGrpNo">
 
<div class="datepicker2" style="align:center">         
</div>               
<input type="hidden" class="form-control datepicker" name="diaryDate" id="diaryDate" style="width:300px;"/>                            

<div id="diaryMainDiv" class="list-group">    
</div>  
    
<form class="form-inline" role="form">
	<input type="text" name="diaryNm" id="diaryNm" class="form-control" placeholder="내용을 입려하세요" style="width:1000px;">
	<a id="registBtn" href="javascript:diaryGrpRegistAjax();" class="btn btn-default">저장</a>
	<a href="javascript:diaryGrpListAjax();" class="btn btn-default">뒤로가기</a>  
</form>

<div id="layerPop">
<p><strong>기능</strong></p>
<br>   
    <p>
     <a id="grpMoveBtn"   class="btn btn-default">이동</a>
	    <a id="grpUpdateBtn"   class="btn btn-default">수정</a>
	    <a id="grpDeleteBtn"  class="btn btn-default">삭제</a>  
	</p>   
	<p style="display:none;" id="diaryGrpUpdateForm"><input type="text" name="diaryUpdateNm" id="diaryUpdateNm" class="form-control" placeholder="내용을 입려하세요" style="width:300px;"><a id="grpUpdateProcBtn"   class="btn btn-default">수정완료</a></p>
    <p></p>         
<a href="#" onclick="closeLayer()" class="close"><img src=">/b_close.gif" border="0"></a>  
</div>